Vue.component('todo-footer', {
  template: `
    <footer class="footer" v-show="todoList.length">
        <span class="todo-count"><strong>{{leftCount}}</strong> item left</span>
        <ul class="filters">
        <li>
            <a class="selected" href="#/">All</a>
        </li>
        <li>
            <a href="#/active">Active</a>
        </li>
        <li>
            <a href="#/completed">Completed</a>
        </li>
        </ul>
        <button
        class="clear-completed"
        v-show="isShowClearCompleted"
        @click="clear"
        >
        Clear completed
        </button>
    </footer>
      `,
})
